//
//  ContentView.swift
//  NaiCha
//
//  Created by 唐安坤 on 2024/7/3.
//

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack(spacing: 30, content:{
            topView()
            HStack(alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/, spacing: 15, content: {
                ZStack(content: {
                    crad(name: "茗古", price: "¥20", mark: "去冰", backColor: Color.orange)
                    Text("买一送一")
                        .foregroundColor(.white)
                        .padding(5)
                        .background(Color.yellow)
                        .cornerRadius(6.0)
                        .offset(CGSize(width: 0.0, height: -72.0))
                })
                crad(name: "甜蜜蜜", price: "¥10", mark: "少冰", backColor: Color.blue)
            })
            crad(name: "茶百道", price: "¥15", mark: "多冰", backColor: Color.purple)
            
            Button(action: {
            
            }, label: {
                /*@START_MENU_TOKEN@*/Text("Button")/*@END_MENU_TOKEN@*/
            })
            .frame(width: 200,height: 100)
            .background(.black)
            Spacer()
        })
        .padding()
        
        
       
    }
}

#Preview {
    ContentView()
}

struct topView: View {
    var body: some View {
        HStack(alignment: .center, spacing: /*@START_MENU_TOKEN@*/nil/*@END_MENU_TOKEN@*/, content: {
            VStack(alignment: .leading, content: {
                Text("炎炎夏日").font(.system(size: 30)).fontWeight(.semibold)
                Text("来杯饮料吧").font(.system(size: 30)).fontWeight(.semibold)
            })
            Spacer()
        })
    }
}

struct crad: View {
    var name: String
    var price: String
    var mark: String
    var backColor:Color
    var body: some View {
        VStack(alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/, spacing: 10, content: {
            Text(name).font(.system(size: 25))
            Text(price).font(.system(size: 30))
            Text(mark).font(.system(size: 20))
        })
        .padding(20)
        .frame(maxWidth: .infinity)
        .foregroundColor(.white)
        .background(backColor)
        .clipShape(RoundedRectangle(cornerRadius: 10))
        
    }
}
